@include theme {
  .app-run {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    .app-run-head {
      position: absolute;
      left: 0;
      right: 0;
      height: 64px;
      z-index: 3;
      box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 36px;

      .app-run-head-left {
        display: flex;
        align-items: center;

        .app-run-head-title {
          color: $colorPrimary;
          font-size: 24px;
          font-weight: bold;
          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
          margin-right: 100px;
        }

        .app-run-head-edit-language {
          color: $colorPrimary;
          display: flex;
          align-items: center;
          border: solid 1px $colorPrimary;
          border-radius: 2px;
          margin-right: 20px;

          & > div {
            padding: 4px 24px;
            cursor: pointer;

            &.active {
              background-color: $colorPrimary;
              color: white;
            }
          }
        }

        .app-run-head-operator {
          display: inline-block;

          & > .pl-button {
            margin-right: 20px;
          }
        }
      }

    }

    .app-run-code, .app-run-case, .app-run-separator {
      position: absolute;
      top: 64px;
      bottom: 0;
      overflow-y: auto;
      overflow-x: hidden;

      &.app-run-code {
        left: 0;
        overflow-y: hidden;

        & > textarea {
          width: 100%;
          height: 100%;
          border: none;
          outline: none;
        }
      }

      &.app-run-case {
        right: 0;
        padding: 20px;
      }

      $separator-color: #eee;

      &.app-run-separator {
        z-index: 99;
        cursor: col-resize;
        background: linear-gradient(
                        45deg,
                        $separator-color 0, $separator-color 25%,
                        #ffffff 25%, #ffffff 50%,
                        $separator-color 50%, $separator-color 75%,
                        #ffffff 75%, #ffffff 100%
        );
        background-size: 32px 32px;
      }
    }

    hr {
      border: 0;
      border-top: 1px solid #eaecef
    }

  }
}
